<template>
  <base-breadcrumb :title="$route.meta.title">
    <!-- 重点监管质量风险监控计划 -->
    <div
      id="base-breadcrumb"
      style="position: relative; z-index: 1"
    >
      <!-- 搜索 -->
      <searchData
        :search-data="searchArr"
        @search="search"
      />
      <!-- 表格 -->
      <a-card :bordered="false">
        <!-- <title-name title="列表"></title-name> -->
        <!--表格-->
        <list-table
          ref="table"
          size="small"
          :rowKey="(record, index) => record ? (record.id + index) : index"
          :columns="columns"
          :isEportIndex="true"
          :isScrollX="false"
          :request="loadData"
          :isShowCountBar="false"
          show-size-changer
          show-quick-jumper
          showPagination="auto"
        >
          <div class="mb12" slot="prefix" slot-scope="ref"></div>
          <AuditSummary
            slot="bottom"
            ref="AuditSummary"
            title=" "
            :init="false"
            :countList="countList"
            :loadCount="loadCount"
            :api="api"
            apiName="count"
            :form="queryParam"
          />
          <span
            slot="sort"
            slot-scope="text, record, index"
          >{{ index + 1 }}</span>
          <more-button
            slot="actions"
            slot-scope="text, record"
          >
            <a
              v-btn-permission="'qm_056_loo_02'"
              @click="handleManage(2, record)"
            >查看</a>
            <a
              v-btn-permission="'qm_056_edi_01'"
              v-if="record.comStatus == '-1'"
              @click="handleManage(0, record)"
            >填报</a>
            <a
              v-btn-permission="'qm_056_edi_01'"
              v-if="record.comStatus == '0' || record.comStatus == '3'"
              @click="handleManage(1, record)"
            >编辑</a>
            <a
              v-btn-permission="'qm_056_rej_04'"
              v-if="record.comStatus == '2'"
              @click="handleManage(3, record)"
            >调整</a>
            <a
              v-btn-permission="'qm_056_exa_03'"
              v-if="record.comStatus != '-1'"
              @click="$bus.$emit('showApprovalDetailsDialog', record.id)"
            >审批信息</a>
          </more-button>
          <!-- 版本 -->
          <a slot="changeVersion" slot-scope="text, record" @click="handleOpenVersion(record)">{{
            record.changeVersion ? 'v' + record.changeVersion : ''
          }}</a>
          <!-- 状态格式化 -->
          <StatusDisplay
            slot="statusText"
            slot-scope="text, record"
            :status-code="record.comStatus"
            :statusMap="statusMap"
          />
        </list-table>
      </a-card>
    </div>
    <a-modal
      centered
      title="历史版本信息"
      width="1200px"
      :visible="versionModal.show"
      @cancel="versionModal.show = false"
      :footer="null"
    >
      <a-table :columns="versionColumns" :data-source="versionModal.source" bordered :loading="versionModal.loading">
        <!-- 版本 -->
        <template slot="changeVersion" slot-scope="text, record, index">
          {{ text ? 'v' + text : '' }}
        </template>
        <!-- 版本 -->
        <template slot="actions" slot-scope="text, record, index">
          <a
            v-btn-permission="'qm_056_loo_02'"
            @click="handleShowHistore(record)"
          >查看详情</a>
        </template>
      </a-table>
    </a-modal>
  </base-breadcrumb>
</template>

<script>
import OrgTreeSelect from '@/components/OrgTreeSelect'
import SelectProjectType from '@/components/Select/SelectProjectType' // 工程类别
import AuditSummary from '@/views/quality/components/AuditSummary' // 汇总
import StatusDisplay from '@/components/StatusDisplay'
import MoreButton from '@/components/MoreButton' // 多按钮容器
import BasePage from '@/views/basePage'
import Selector from '@/components/Select/Selector' // 选择器
import { riskMonitorPlan } from '@/api/quality/risk/monitoringPlan'
const statusMap = [
  {
    value: '-1',
    label: '待填报',
    color: 'gray'
  },
  {
    value: '0',
    label: '待提交审批',
    color: 'gray'
  },
  {
    value: '1',
    label: '审批中',
    color: 'green'
  },
  {
    value: '2',
    label: '审批通过',
    color: 'green'
  },
  {
    value: '3',
    label: '审批不通过',
    color: 'red'
  },
]
const searchArr = [
  // 搜索框
  {
      name: '所属单位',
      valueKey: 'searchQuery',
      type: OrgTreeSelect,
  },
  {
      name: '填报时间',
      value: 'fillerDate',
      type: 'dateRange',
      rangeFormat: ['fillerStartDate', 'fillerEndDate']
  },
  {
    name: '状态',
    value: 'status',
    type: 'select',
    data: statusMap
  },
  {
    name: '工程类别',
    type: SelectProjectType,
    valueKey: 'projectTypeId',
    showStop: true,
  },
  
]
const columns = [
  {
    title: '序号',
    dataIndex: 'index',
    width: 80,
    scopedSlots: { customRender: 'sort' }
  },
  {
    title: '分公司',
    ellipsis: true,
    dataIndex: 'branchComName'
  },
  {
    title: '项目名称',
    ellipsis: true,
    dataIndex: 'projectName'
  },
  {
    title: '填报时间',
    ellipsis: true,
    dataIndex: 'modifiedTime'
  },
  {
    title: '版本信息',
    ellipsis: true,
    dataIndex: 'changeVersion',
    scopedSlots: { customRender: 'changeVersion' },
  },
  {
    title: '状态',
    dataIndex: 'statusText',
    scopedSlots: { customRender: 'statusText' }
  },
  {
    title: '操作',
    dataIndex: 'actions',
    width: 150,
    align: 'center',
    scopedSlots: { customRender: 'actions' }
  }
]
const versionColumns = [
  {
    title: '版本号',
    ellipsis: true,
    dataIndex: 'changeVersion',
    scopedSlots: { customRender: 'changeVersion' },
  },
  {
    title: '填报时间',
    ellipsis: true,
    dataIndex: 'modifiedTime'
  },
  {
    title: '操作',
    dataIndex: 'actions',
    width: 150,
    align: 'center',
    scopedSlots: { customRender: 'actions' }
  }
]
export default {
  name: 'a' + Date.now(),
  extends: new BasePage(),
  components: {
    AuditSummary,
    StatusDisplay,
    MoreButton
  },
  data() {
    this.columns = columns
    this.versionColumns = versionColumns
    this.searchArr = searchArr
    this.statusMap = {}
    statusMap.forEach(item => {
      this.statusMap[item.value] = {
        label: item.label,
        color: item.color
      }
    })
    return {
      exportLoading: false, // 导出加载控件
      versionModal: {
        show: false,
        loading: false,
        source: [],
        id: '',
        projectId: '',
        branchComName: '',
        projectName: '',
      },
      // 表格加载
      queryParam: {}, // 查询参数
      countList: [
        {
          title: '总数',
          value: 'total'
        },
        {
          title: '待填报',
          value: 'dtb'
        },
        {
          title: '待提交审批',
          value: 'draft'
        },
        {
          title: '审批中',
          value: 'submitted'
        },
        {
          title: '审批通过',
          value: 'past'
        },
        {
          title: '审批不通过',
          value: 'rejected'
        },
      ], // 汇总列表
      api: riskMonitorPlan,
      loadCount: 0,
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        this.loadCount++
        const requestParameters = Object.assign({}, parameter, this.queryParam)
        return this.api.getList(requestParameters).then((res) => {
          res.data?.forEach((item,index)=>{
            const arr  = statusMap.filter(i => item && item.comStatus == i.value)
            if (arr.length) {
              item.statusText = arr[0].label
            }
          })
          return res
        })
      }
    }
  },
  methods: {
    /**
     * @description: 搜索
     * @param {*} value：表单对象
     */
    search(value) {
      if (value) {
        if (value.fillerDate) {
          if (value.fillerDate.length > 0) {
            value.fillerStartDate = value.fillerDate[0].format('YYYY-MM-DD')
            value.fillerEndDate = value.fillerDate[1].format('YYYY-MM-DD')
          }
          delete value.fillerDate
        }
        this.queryParam = value
      }
      this.$refs.table.refresh(true)
    },
    /**
     * @description: 跳转操作页
     * @param {*} type：操作类型： 0 填报；1调整；2 查看；3 验证；4 生成整改单
     * @param {*} id：业务id
     */
    handleManage(type, record, historyId) {
      if (record) {
        this.$router.push({
          name: 'qualityriskIdentificationmonitoringPlanInfo',
          query: {
            id: record.id, // 业务id
            historyId: historyId,
            editModel: type, // 操作类型
            projectId: record.projectId,
            branchComName: record.branchComName,
            projectName: record.projectName
          }
        })
      } else {
        this.$router.push({
          name: 'qualityriskIdentificationmonitoringPlanInfo',
        })
      }
    },
    handleShowHistore(record) {
      this.versionModal.show = false
      const version = this.versionModal
      this.$router.push({
        name: 'qualityriskIdentificationmonitoringPlanInfo',
        query: {
          id: version.id, // 业务id
          historyId: record.id,
          editModel: '2', // 操作类型
          projectId: version.projectId,
          branchComName: version.branchComName,
          projectName: version.projectName
        }
      })
    },
    handleOpenVersion(record) {
      if (record.changeVersion) {
        this.versionModal.show = true
        this.versionModal.source = []
        this.versionModal.id = record.id
        this.versionModal.projectId = record.projectId
        this.versionModal.branchComName = record.branchComName
        this.versionModal.projectName = record.projectName
        this.versionModal.loading = true
        this.api.getHistory(record.id).then(res => {
          if (res.code === 200) {
            this.versionModal.source = res.data || []
          }
          this.versionModal.loading = false
        }).catch(() => {
          this.versionModal.loading = false
        })
      }
    },
  }
}
</script>